<template>
   <div id="tabs">
            <!-- 显示剩余未完成事项，用itemTodo计算属性实现 -->
            <span style="cursor: default;"><i v-text="itemTodo"></i>items Left</span>
            <!-- tab栏切换，点击时切换currentList指向的tab栏 -->
            <span :class="{select:current===2}" @click="$emit(`changeList`,2)">All Lists</span>
            <span :class="{select:current===0}" @click="$emit(`changeList`,0)">Todo Lists</span>
            <span :class="{select:current===1}" @click="$emit(`changeList`,1)">Done Lists</span>
            <span @click="$emit(`cleardone`)">ClearDone</span>
        </div>
</template>

<script>
export default {
    props:["itemTodo","current"]
}
</script>

<style>

</style>